<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>

</body>
<script>
    //具有iterator接口 即可实现迭代器
    // 声明一个数组
    const xiyou = ['唐僧', '孙悟空', '猪八戒', '沙僧'];

    //使用for of遍历数组
    for (let v of xiyou) {
        console.log(v);
    }

    console.log(xiyou);

    // 工作原理
    // a)创建一个指针对象，指向当前数据结构的起始位置
    // b)第一次调用对象的next方法，指针自动指向数据结构的第一个成员
    // c) 接下来不断调用next方法，指针一直往后移动，直到指向最后一个成员
    // d)每调用next方法返回一个包含value和done属性的对象
    // 注：需要自定义遍历数据的时候，要想到迭代器

    let iterator = xiyou[Symbol.iterator]();

    // 调用对象的next方法
    console.log(iterator);
    console.log(iterator.next()); //唐僧
    console.log(iterator.next()); //孙悟空
    console.log(iterator.next()); //猪八戒
    console.log(iterator.next()); //沙僧
    console.log(iterator.next()); //undefined
</script>

</html>